<template>
  <div>
    <div class="at"></div>
    <div class="bt"></div>
    <div class="ct"></div>
    <div class="dt"></div>
  </div>
</template>
  <!-- 引入 Element UI JS -->
  <script>
// 初始化Vue实例
import LingChart from "@/components/LineChart/index.vue";
import BarChart from "@/components/barEchart/index.vue";
import RingChart from "@/components/Echart/index.vue";
import ContentReal from "@/views/home/components/Realstatus";
import Table from "@/views/ComprehensiveSituation/components/tabContent";
export default {
  components: {
    RingChart,
    ContentReal,
    Table,
    LingChart,
    BarChart,
  },
  data() {
    return {
      opstion: {},
      chartData: [],
      chartData1: {
        xAxis: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月"],
        seriesData: [100, 600, 200, 300, 100, 1200, 500, 510], // 模拟数据，可替换为真实数据
      },
      chartData6: {
        xAxis: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月"],
        seriesData: [500, 300, 900, 400, 800, 200, 350, 850],
      },
      deviceData: [
        { name: "手工氩弧焊机", online: 0, total: 7, status: "standby" },
        { name: "气保焊机", online: 0, total: 5, status: "standby" },
        { name: "带极堆焊机", online: 0, total: 10, status: "standby" },
        { name: "等离子切割机", online: 0, total: 3, status: "standby" },
        { name: "空压机", online: 0, total: 2, status: "standby" },
      ],
      ListData: [
        { id: 1, title: "焊接总支数", value: "474" },
        { id: 2, title: "探伤总支数", value: "581" },
        { id: 3, title: "弯管总支数", value: "371" },
        { id: 4, title: "焊口总数", value: "2375" },
        { id: 5, title: "焊口总数", value: "2981" },
        { id: 6, title: "弯头总数", value: "2448" },
      ],
    };
  },
  mounted() {
    // var myChart3 = echarts.init(document.getElementById("stats-item"));
  },
};
</script>
<style lang="less" scoped>
// @import "./css/home.css";
.chart-container {
  // background: red;
  margin-top: 2rem;
  // display: flex;
  // width: 7rem;
  // height: 7rem;
  // margin-bottom: 1rem;
  // border: 1px solid #ebeef5;
  // border-radius: 8px;
  // padding: 20px;
  box-sizing: border-box;
}
.left-panel .el-card {
  // background: red;
  height: 30%;
}
.left-panel .el-card:last-child {
  // background: red;
  flex: 1;
  height: 100%;
}
.at {
  width: 100px;
  height: 80px;
  border: 1px solid black;
}
.bt {
  width: 100px;
  height: 80px;
  border: 1px solid black;
}
.ct {
  width: 100px;
  height: 80px;
  border: 1px solid black;
}
.dt {
  width: 100px;
  height: 80px;
  border: 1px solid black;
}
</style>
